<!doctype html>
<html>
  <head>
    <title>CSS Exercise 4</title>
    <link href="CSSPresentationEx4.css" rel="stylesheet"/>
  </head>
  <body>
    <div>
      <div class="display">
        8854435
      </div>
      <div class="decim">

        <table class="digit">
          <tr>
            <td>0000</td>
            <td>0000</td>
            <td>0000</td>
            <td>0000</td>
            <td>0000</td>
            <td>0000</td>
            <td>0000</td>
            <td>0000</td>
          </tr>
          <tr>
            <td>63</td>
            <td></td>
            <td></td>
            <td></td>
            <td>47</td>
            <td></td>
            <td></td>
            <td class="right">32</td>
          </tr>
          <tr>
            <td>0000</td>
            <td>0000</td>
            <td>1000</td>
            <td>0111</td>
            <td>0001</td>
            <td>1011</td>
            <td>1011</td>
            <td>0111</td>
          </tr>
          <tr>
            <td>31</td>
            <td></td>
            <td></td>
            <td></td>
            <td>15</td>
            <td></td>
            <td></td>
            <td class="right">0</td>
          </tr>
        </table>


      </div>
      <table class="keyboard">
        <tr>
          <td>
            <button class="inactive"> </button>
          </td>
          <td>
            <button class="active">Mod</button>
          </td>
          <td>
            <button class="inactive">A</button>
          </td>
          <td>
            <button class="inactive">MC</button>
          </td>
          <td>
            <button class="inactive">MR</button>
          </td>
          <td>
            <button class="inactive">MS</button>
          </td>
          <td>
            <button class="inactive">M+</button>
          </td>
          <td>
            <button class="inactive">M-</button>
          </td>
        </tr>
        <tr>
          <td>
            <button class="active">(</button>
          </td>
          <td>
            <button class="active">)</button>
          </td>
          <td>
            <button class="inactive">B</button>
          </td>
          <td>
            <button class="active">
              <--
            </button>
          </td>
          <td>
            <button class="active">CE</button>
          </td>
          <td>
            <button class="active">C</button>
          </td>
          <td>
            <button class="active">+-</button>
          </td>
          <td>
            <button class="inactive">sqr</button>
          </td>
        </tr>
        <tr>
          <td>
            <button class="active">RoL</button>
          </td>
          <td>
            <button class="active">RoR</button>
          </td>
          <td>
            <button class="inactive">C</button>
          </td>
          <td>
            <button class="active">7</button>
          </td>
          <td>
            <button class="active">8</button>
          </td>
          <td>
            <button class="active">9</button>
          </td>
          <td>
            <button class="active">/</button>
          </td>
          <td>
            <button class="inactive">%</button>
          </td>
        </tr>
        <tr>
          <td>
            <button class="active">Or</button>
          </td>
          <td>
            <button class="active">Xor</button>
          </td>
          <td>
            <button class="inactive">D</button>
          </td>
          <td>
            <button class="active">4</button>
          </td>
          <td>
            <button class="active">5</button>
          </td>
          <td>
            <button class="active">6</button>
          </td>
          <td>
            <button class="active">*</button>
          </td>
          <td>
            <button class="inactive">1/x</button>
          </td>
        </tr>
        <tr>
          <td>
            <button class="active">Lsh</button>
          </td>
          <td>
            <button class="active">Rsh</button>
          </td>
          <td>
            <button class="inactive">E</button>
          </td>
          <td>
            <button class="active">1</button>
          </td>
          <td>
            <button class="active">2</button>
          </td>
          <td>
            <button class="active">3</button>
          </td>
          <td>
            <button class="active">-</button>
          </td>
          <td rowspan="2">
            <button  class="active" id="ravno">=</button>
          </td>
        </tr>
        <tr>
          <td>
            <button class="active">Not</button>
          </td>
          <td>
            <button class="active">And</button>
          </td>
          <td>
            <button class="inactive">F</button>
          </td>
          <td colspan="2">
            <button  class="active" id="zero">0</button>
          </td>
          <td>
            <button class="inactive">.</button>
          </td>
          <td>
            <button class="active">+</button>
          </td>
        </tr>
      </table>
      <div class="checknum">
        <form method="get">
          <input name="numeric" type="radio" id="hex" value="he" />
          <label for="hex">Hex</label>
          <input name="numeric" type="radio" id="dec" value="de" />
          <label for="dec">Dec</label>
          <input name="numeric" type="radio" id="oct" value="oc" />
          <label for="oct">Oct</label>
          <input name="numeric" type="radio" id="bin" value="bi" />
          <label for="bin">Bin</label>
        </form>
      </div>
      <div class="checksize">
        <form method="get">
          <input name="size" type="radio" id="qword" value="qw" />
          <label for="qword">Qword</label>
          <input name="size" type="radio" id="dword" value="dw" />
          <label for="dword">Dword</label>
          <input name="size" type="radio" id="word" value="wo" />
          <label for="word">Word</label>
          <input name="size" type="radio" id="byte" value="by" />
          <label for="byte">Byte</label>
        </form>
      </div>
    </div>
  </body>
</html>